<!-- 左侧用户导航组件 -->
<div class="lg:w-80 flex-shrink-0">
    <div class="bg-white rounded-lg border p-6">
        <div class="flex flex-col items-center text-center mb-6">
            <!-- 用户头像 -->
            <div class="relative">
                <%- include('../../components/avatar', { user: user, size: 'w-20 h-20', classes: 'rounded-full object-cover border-4 border-white shadow-lg' }) %>
                <button class="absolute bottom-0 right-0 w-6 h-6 bg-blue-600 text-white rounded-full flex items-center justify-center text-xs hover:bg-blue-700 transition-colors duration-200">
                    <i class="fas fa-camera"></i>
                </button>
            </div>
            <h2 class="mt-4 text-xl font-semibold text-gray-900"><%= user.username %></h2>
            <p class="text-sm text-gray-500"><%= user.email %></p>
            <span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-green-100 text-green-800 mt-2">
                <i class="fas fa-circle text-green-400 mr-1" style="font-size: 6px;"></i>
                在线
            </span>
        </div>

        <!-- 导航菜单 -->
        <nav class="space-y-2">
            <%- include('../../components/nav', { href: '/user/profile', text: '基本信息', icon: 'fas fa-user', className: 'w-full py-3' }) %>
            <%- include('../../components/nav', { href: '/user/security', text: '账户安全', icon: 'fas fa-shield-alt', className: 'w-full py-3' }) %>
        </nav>

        <!-- 统计信息 -->
        <div class="mt-8 pt-6 border-t border-gray-200">
            <div class="space-y-3">
                <div class="flex justify-between text-sm">
                    <span class="text-gray-500">加入时间</span>
                    <span class="text-gray-900"><%= user.created_at %></span>
                </div>
                <div class="flex justify-between text-sm">
                    <span class="text-gray-500">上次登录</span>
                    <span class="text-gray-900"><%= user.last_login_at %></span>
                </div>
            </div>
        </div>
    </div>
</div>